<template>
  <div class="home">
    <div>
      <!-- main组件的二级路由插座 -->
      <router-view></router-view>
    </div>

    <div>
      <van-tabbar v-model="active" active-color="#FECA2D">
        <van-tabbar-item
          v-for="(item, index) in tabdata"
          :icon="item.iconname"
          :key="index"
          @click="toggleTabbar(index)"
          >{{ item.van_title }}</van-tabbar-item
        >
      </van-tabbar>
    </div>
  </div>
</template>

<script>
export default {
  name: "Home",
  data() {
    return {
      active: 0,
      ishowe: true,

      tabdata: [
        {
          iconname: "wap-home-o",
          van_title: "首页",
          goname: "recommend",
        },
        {
          iconname: "star-o",
          van_title: "收藏",
          goname: "collect",
        },
        {
          iconname: "user-circle-o",
          van_title: "我的",
          goname: "my",
        },
      ],
    };
  },
  methods: {
    toggleTabbar(index) {
      let getuser = localStorage.getItem("codeok");

      if (getuser) {
        this.ishowe = false;
      }
      if (this.ishowe) {
        this.$router.push({ name: this.tabdata[index].goname });
        if (this.tabdata[index].goname == "my") {
          if (!getuser) {
            this.$router.push({ name: "register" });
          } else {
            this.$router.push({ name: this.tabdata[index].goname });
          }
        }
      } else {
        this.$router.push({ name: this.tabdata[index].goname });
      }

      //跳转二级路
      localStorage.setItem("historyactive", JSON.stringify(index));
    },

    fun() {
      let getactive = JSON.parse(localStorage.getItem("historyactive"));
      if (getactive == null) {
        return;
      }
      this.active = getactive;
    },
  },
  created() {
    this.fun();
  },
};
</script>
<style lang="less" scoped>
</style>
